<!--选择计划 -->
<template>
<div>
<!-- 模式列表 -->
<ul class="pad-25">
        <li v-for="(v,k) in findOpenPlanEntrance" :key="k" @click="jumPageFun(v)" class="pad-30 bg-fff bor-5 mag-b-20">
          <div class="fiex">
               <div>
                  <img class="bill-iocn-img" src="../images/zd_huankuan1.png" />
              </div>
              <div class="fiex1 mag-l-20">
                <div  class="fiex">
                  <div>
                     <div class="f-32 c43 fiex pr">
                       <span>{{v.name}}</span>
                     </div>
                     <div class="c94 f-20 f-left">还款金额 {{v.moneyRange}}</div>
                  </div>
                  <div v-if="queryRateB.sumRate" class="c43 f-30 fiex1 f-right">
                    <span v-if="v.productIdentif=='PB999'">{{queryRateB.sumRate}}% + {{queryRateB.singlePrice}}元</span>
                    <span v-else-if="v.productIdentif=='PS888'">{{queryRateS.sumRate}}% + {{queryRateS.singlePrice}}元</span>
                    <span v-else-if="v.productIdentif=='PB100'">{{queryRateNY.sumRate}}% + {{queryRateNY.singlePrice}}元</span>
                  </div>
                </div>
              </div>
          </div>
          <div class="info">
            <div class="info-title">模式介绍:</div>
            <div class="info-test">
              {{v.introduce}}
            </div>
          </div>
           
          </li>
      </ul>
      <ul style="display:none" class="pad-25">
          <li @click="jumPageFun('BG')" class="pad-30 bg-fff fiex bor-5">
              <div>
                  <img class="bill-iocn-img" src="../images/zd_huankuan1.png" />
              </div>
              <div class="fiex1 mag-l-20">
                <div  class="fiex">
                  <div>
                     <div class="f-32 c43 fiex pr">
                       <span>大额懒人模式（推荐）</span>
                       <!-- <img class="bill-iocn-tip mag-l-10" src="../../images/zd_shuoming.png" /> -->
                        <!-- 支持的银行 -->
                       <!-- <div class="pa pad-20 bill-tip fff f-22 f-left">
                         <div class="pr icon-down">
                           <div class="pa triangle-up"></div>
                           支持浦发银行单笔单日1万；邮储，光大，招商，交通，民生，华夏，平安，广州，上海，建设，工商，北京，中信
                         </div>
                       </div> -->
                     </div>
                     <div class="c94 f-20 f-left">还款金额 500元 - 30w元</div>
                  </div>
                  <div class="c43 f-30 fiex1 f-right">
                    {{queryRateB.rate}}% + {{queryRateB.singlePrice}}元
                  </div>
                </div>
              </div>
          </li>
          <!-- <li @click="jumPageFun('SG')" class="pad-30 bg-fff fiex mag-t-20 bor-5">
              <div>
                  <img class="bill-iocn-img" src="../images/zd_huankuan2.png" />
              </div>
              <div class="fiex1 mag-l-20">
                <div class="fiex">
                  <div>
                     <div class="f-32 c43 fiex pr">
                       <span>小额新手模式（备用）</span>
                     </div>
                     <div class="c94 f-20 f-left">还款金额 500元 - 10w元</div>
                  </div>
                  <div class="c43 f-30 fiex1 f-right">
                    {{queryRateS.rate}}% + {{queryRateS.singlePrice}}元
                  </div>
                </div>
              </div>
          </li> -->
      </ul>
      <div @click="$router.push('/homeplanList')" class="foot-box fiex center">
        <div class="fiex1 sel">
            计划查询
        </div>
   </div>

</div>
</template>

<script>
var self='';
export default {
data() {
return {
    token:"",
    queryRateB:"", //大额相关数据
    queryRateS:"",//小额相关数据
     findOpenPlanEntrance:{},//通道列表

}
},
//生命周期 - 创建完成（访问当前this实例）
created() {

},
//生命周期 - 挂载完成（访问DOM元素）
mounted() {
self=this;
// console.log(self.$store.state.token)
// self.token = self.getUrl('token');
self.token = self.$store.state.token
// console.log(self.token)

self.getRate(); //获取费率
}
//方法定义
,methods:{
   async getRate(){ //获取用户费率
         //获取大额费率
        var queryRateB = await self.$axiosFun('plan/plan/queryRate',{
            token: self.token,
            productIdentif:"PB999"
         },'get');
         self.queryRateB= JSON.parse(queryRateB.data);
         self.queryRateB.singlePrice = self.$accMul(self.queryRateB.singlePrice,0.01);
         self.queryRateB.rate = self.$accMul(self.queryRateB.rate,100);

        //获取小额费率
        var queryRateS = await self.$axiosFun('plan/plan/queryRate',{
            token: self.token,
            productIdentif:"PS888"
         },'get'); 
         self.queryRateS = JSON.parse(queryRateS.data);
        self.queryRateS.singlePrice = self.$accMul(self.queryRateS.singlePrice,0.01);
         self.queryRateS.rate = self.$accMul(self.queryRateS.rate,100);
        console.log("大额费率",self.queryRateB)
        console.log("小额费率",self.queryRateS)
          //农业兴业专用支付
        var queryRateNY = await self.$axiosFun('plan/plan/queryRate',{
            token: self.token,
            productIdentif:"PB100"
         },'get'); 
         self.queryRateNY = JSON.parse(queryRateNY.data);
         self.queryRateNY.singlePrice = self.$accMul(self.queryRateNY.singlePrice,0.01);
         self.queryRateNY.rate = self.$accMul(self.queryRateNY.rate,100);
          if(!self.queryRateNY.rewardRate){
            self.queryRateNY.rewardRate = 0;
         }else{
            self.queryRateNY.rewardRate = self.$accMul(self.queryRateNY.rewardRate,100);
         }
         self.queryRateNY.sumRate =  self.$accAdd(self.queryRateNY.rate,self.queryRateNY.rewardRate); //计算总费率

        console.log("大额费率",self.queryRateB);
        console.log("小额费率",self.queryRateS);
        //获取通道接口
           var queryRateS = await self.$axiosFun('plan/planEntrance/findOpenPlanEntrance',{
            token: self.token,
            programNameWeb: 'kyq',
         },'get'); 
         this.findOpenPlanEntrance = queryRateS.data;
         console.log("获取通道接口",queryRateS)
    },
    jumPageFun(req){ //页面选择  val:BG 大额  SG:小额
      var model  ="";
      var val = req.column3; //通道的唯一标识
      if(val=='BGD'){
          model = '9';
      }
     if(val=='SG'){
          model = '3';
      }
      localStorage.setItem("model",model);
      localStorage.setItem("jumPageData",val); //制定计划为大额还是小额 进行存储 
      self.$router.push('/dzx');
    }
}
}
</script>
<style scoped>
/* @import url(); 引入css类 */
.foot-box .sel{color:#4F8BF4; }
.foot-box{background: #fff;z-index: 100;position: fixed; bottom:0; width: 100%; padding: 15px 0; box-shadow: 0px -2px 3px 3px rgba(245, 241, 241, 0.8)  }
.bill-iocn-img{width: 0.78rem; height: 0.78rem;}
.bill-iocn-tip{width: 0.28rem; height: 0.28rem;}
.bill-tip{background:rgba(0, 0, 0, 0.8); border-radius: 0.1rem;width: 5rem; top: 0.6rem;z-index: 2;}
.triangle-up { right: 2.05rem;top: -0.35rem;width: 0;height: 0;border-left: 0.15rem solid transparent;border-right: 0.15rem solid transparent;border-bottom: 0.2rem solid rgba(0, 0, 0, 0.8);;}
.info-title{font-size: 0.25rem;color: #6384b2; }
.info-test{font-size: 0.2rem;color: #b9b6b6;}
.info{border-top: 0.02rem solid #ddd;margin-top: 0.2rem;padding-top: 0.2rem;}
</style>